<template>
  <div class="app-container">
    <el-row :gutter="10">
      <!--树结构-->
      <el-col :span="4" :xs="24">
        <div class="app-container-tree-border">
          <el-tree :data="syTypeList" :props="defaultProps" :expand-on-click-node="false" ref="tree" node-key="id"
            highlight-current @node-click="handleNodeClick">
            <div slot-scope="{node, data}" class="custom-tree-node" :title="node.label" v-text="node.label"></div>
          </el-tree>
        </div>
      </el-col>
      <el-col :span="20" :xs="24">
        <div class="app-container-table-border">
          <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"
            label-width="0px" class="top-left">
            <el-form-item label prop="reportName">
              <el-input v-model="queryParams.reportName" placeholder="请输入试验名称" clearable
                @keyup.enter.native="handleQuery" style="width: 180px;" />
            </el-form-item>
            <el-form-item label prop="reportDate">
              <el-date-picker clearable v-model="queryParams.reportDate" type="date" value-format="yyyy-MM-dd"
                placeholder="请选择试验日期" style="width: 180px;"></el-date-picker>
            </el-form-item>
            <!-- <el-form-item label="" prop="bgCode">
            <el-input v-model="queryParams.bgCode" placeholder="请输入报告编号" clearable
              @keyup.enter.native="handleQuery" />
            </el-form-item>-->
            <el-form-item label prop="ypCode">
              <el-input v-model="queryParams.ypCode" placeholder="请输入样品编号" clearable @keyup.enter.native="handleQuery"
                style="width: 180px;" />
            </el-form-item>
            <!-- <el-form-item label="记录编号" prop="jlCode">
            <el-input v-model="queryParams.jlCode" placeholder="请输入记录编号" clearable
              @keyup.enter.native="handleQuery" />
            </el-form-item>-->

            <el-form-item>
              <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
              <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
            </el-form-item>
          </el-form>

          <el-row :gutter="10" class="mb5 top-right-btn small-line-height">
            <el-col :span="1.5">
              <el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd"
                v-hasPermi="['syrw:bsDataReport:add']">新增</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate"
                v-hasPermi="['syrw:bsDataReport:edit']">修改</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple"
                @click="handleDelete" v-hasPermi="['syrw:bsDataReport:remove']">删除</el-button>
            </el-col>
            <el-col :span="1.5">
              <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
                v-hasPermi="['syrw:bsDataReport:export']">导出</el-button>
            </el-col>
            <!-- <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> -->
          </el-row>

          <el-table border stripe v-loading="loading" :data="bsDataReportList"
            @selection-change="handleSelectionChange">
            <el-table-column type="selection" width="55" align="center" />
            <el-table-column label="唯一标识一份试验任务" align="center" prop="reportId" v-if="false" />
            <el-table-column label="所属试验类型" align="center" prop="syTypeStr" min-width="180" show-overflow-tooltip />
            <el-table-column label="所属试验室id" align="center" prop="deptId" v-if="false" />
            <el-table-column label="试验名称" align="center" prop="reportName" min-width="180" show-overflow-tooltip />
            <el-table-column label="试验日期" align="center" prop="reportDate" width="120">
              <template slot-scope="scope">
                <span>{{ parseTime(scope.row.reportDate, '{y}-{m}-{d}') }}</span>
              </template>
            </el-table-column>
            <el-table-column label="报告编号" align="center" prop="bgCode" min-width="180" show-overflow-tooltip />
            <el-table-column label="样品编号" align="center" prop="ypCode" min-width="180" show-overflow-tooltip />
            <el-table-column label="记录编号" align="center" prop="jlCode" min-width="180" show-overflow-tooltip />
            <el-table-column label="所属合同id" align="center" prop="contractId" v-if="false" />
            <el-table-column label="包含excel份数" align="center" prop="excelNums" width="116" show-overflow-tooltip />
            <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width" width="130">
              <template slot-scope="scope">
                <el-tooltip class="item" effect="dark" content="修改" placement="bottom">
                  <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
                    v-hasPermi="['syrw:bsDataReport:edit']"></el-button>
                </el-tooltip>
                <el-tooltip class="item" effect="dark" content="填报" placement="bottom">
                  <el-button size="mini" type="text" icon="el-icon-edit-outline" @click="handleTb(scope.row)"
                    v-hasPermi="['syrw:bsDataReport:tb']"></el-button>
                </el-tooltip>
                <el-tooltip class="item" effect="dark" content="复制" placement="bottom">
                  <el-button size="mini" type="text" icon="el-icon-document-copy" @click="handleCopy(scope.row)"
                    v-hasPermi="['syrw:bsDataReport:copy']"></el-button>
                </el-tooltip>
                <el-tooltip class="item" effect="dark" content="附件" placement="bottom">
                  <el-button size="mini" type="text" @click="handleCopy(scope.row)"
                    v-hasPermi="['syrw:bsDataReport:copy']">
                    <span class="iconfont icon-shangchuanfujian"></span>
                  </el-button>
                </el-tooltip>
                <el-tooltip class="item" effect="dark" content="导出" placement="bottom">
                  <el-button size="mini" type="text" @click="handleCopy(scope.row)"
                    v-hasPermi="['syrw:bsDataReport:copy']">
                    <span class="iconfont icon-xiazai2"></span>
                  </el-button>
                </el-tooltip>

                <!-- <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
                v-hasPermi="['syrw:bsDataReport:remove']">删除
                </el-button>-->
              </template>
            </el-table-column>
          </el-table>

          <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize" @pagination="getList" />
        </div>
      </el-col>
    </el-row>
    <!-- 添加或修改数据报告对话框 -->
    <jy-dialog :title="title" :visible.sync="open" width="1000px" append-to-body>
      <el-form ref="form" :model="form" :rules="rules" label-width="100px">
        <el-row>
          <el-col :span="12">
            <el-form-item label="所属试验类型" prop="syType">
              <el-cascader v-model="form.syType" :options="syTypeList" :show-all-levels="false"
                :props="{ expandTrigger: 'hover', value: 'id', emitPath: false }" @change="handleChange"
                style="width: 100%;"></el-cascader>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="试验名称" prop="reportName">
              <el-input v-model="form.reportName" placeholder="请输入试验名称" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="试验日期" prop="reportDate">
              <el-date-picker clearable v-model="form.reportDate" type="date" value-format="yyyy-MM-dd"
                placeholder="请选择试验日期" style="width: 100%;"></el-date-picker>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="报告编号" prop="bgCode">
              <el-input v-model="form.bgCode" placeholder="请输入报告编号" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="记录编号" prop="jlCode">
              <el-input v-model="form.jlCode" placeholder="请输入记录编号" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="样品编号" prop="ypCode">
              <el-input v-model="form.ypCode" placeholder="请输入样品编号" />
            </el-form-item>
          </el-col>
        </el-row>
        <!--            <el-row>-->
        <!--              <el-col :span="12">-->
        <!--                <el-form-item label="样品分类" prop="ypVo.ypClass">-->
        <!--                  <el-input v-model="form.ypVo.ypClass" placeholder="请输入样品分类" />-->
        <!--                </el-form-item>-->
        <!--              </el-col>-->
        <!--              <el-col :span="12">-->
        <!--                <el-form-item label="样品描述" prop="ypVo.ypDescribe">-->
        <!--                  <el-input v-model="form.ypVo.ypDescribe" placeholder="请输入样品描述" />-->
        <!--                </el-form-item>-->
        <!--              </el-col>-->
        <!--            </el-row>-->
        <span>以下信息会被引入到excel中，请谨慎填写</span>
        <el-row>
          <el-col :span="12">
            <el-form-item label="工程部位" prop="ypVo.gcbw">
              <el-input v-model="form.ypVo.gcbw" placeholder="请输入工程部位" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="样品名称" prop="ypVo.yangpmc">
              <el-input v-model="form.ypVo.yangpmc" placeholder="请输入样品名称" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="样品状态" prop="ypVo.yangpzt">
              <el-input v-model="form.ypVo.yangpzt" placeholder="请输入样品状态" />
              <!--                  <el-select clearable v-model="form.ypVo.ypStatus" placeholder="请选择样品状态"-->
              <!--                    style="margin-bottom: 5px; width: 100%;">-->
              <!--                    <el-option v-for="dict in dict.type.yp_status" :key="dict.value" :label="dict.label"-->
              <!--                      :value="dict.value"></el-option>-->
              <!--                  </el-select>-->
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="来样时间" prop="ypVo.ypDate">
              <el-date-picker clearable style="width: 100%" v-model="form.ypVo.ypDate" type="date"
                value-format="yyyy-MM-dd" placeholder="请选择来样时间"></el-date-picker>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="样品数量" prop="ypVo.yangpsl">
              <el-input v-model="form.ypVo.yangpsl" placeholder="请输入样品数量（需填写单位）" />
            </el-form-item>
          </el-col>

          <el-col :span="12">
            <el-form-item label="分部分项名称" prop="ypVo.fbfxmc">
              <el-input v-model="form.ypVo.fbfxmc" placeholder="请输入分部分项名称" />
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="取样人" prop="ypVo.ypPerson">
              <el-input v-model="form.ypVo.ypPerson" placeholder="请输入取样人" />
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="包含excel份数" prop="excelNums" class="narrow-spacing">
              <el-input v-model="form.excelNums" disabled placeholder="请输入包含excel份数" />
            </el-form-item>
          </el-col>
        </el-row>
        <span>Excel类型可以被多次选择,表示同一excel有多张; 序号即报表展示的顺序</span>
        <el-table border stripe :data="form.excelTypeList" :span-method="objectSpanMethod">
          <!-- <el-table-column prop="excelIndex" label="序号" align="center" width="80">
                <template #default="scope">
                  <span>{{ scope.$index + 1 }}</span>
                </template>
          </el-table-column>-->
          <el-table-column prop="excelPageNum" label="序号" align="center" width="80"></el-table-column>
          <el-table-column prop="excelTypeId" label="Excel类型" align="center" :show-overflow-tooltip="true">
            <template #header>
              <el-tooltip class="item" effect="dark" :content="'这是必填项'" placement="top">
                <span>
                  <span style="color: red;">*</span>
                  Excel类型
                </span>
              </el-tooltip>
            </template>
            <template slot-scope="scope">
              <div v-if="scope.row.excelId">{{ scope.row.excelTypeName }}</div>
              <el-form-item v-else :prop="'excelTypeList[' + scope.$index + '].excelTypeId'" label-width="0px"
                :rules="rules.excelTypeId">
                <el-select clearable @change="excelTypeChange(scope.row)" v-model="scope.row.excelTypeId"
                  placeholder="请选择Excel类型" size="small" style="width: 100%;">
                  <el-option v-for="item in biExcelTypeList" :key="item.excelTypeId" :label="item.excelTypeName"
                    :value="item.excelTypeId" :disabled="disabledSelectArr.includes(item.excelTypeId)"></el-option>
                </el-select>
              </el-form-item>
            </template>
          </el-table-column>
          <el-table-column prop="label" label="简称" align="center" :show-overflow-tooltip="true">
            <template #default="scope">
              <div>{{ scope.row.label }}</div>
              <!-- <el-form-item v-else :prop="'excelTypeList[' + scope.$index + '].label'" label-width="0px">
                    <el-select disabled v-model="scope.row.label" size="small" style="width: 100%;">
                      <el-option v-for="item in biExcelTypeList" :key="item.excelTypeId" :label="item.label"
                        :value="item.excelTypeId"></el-option>
                    </el-select>
              </el-form-item>-->
            </template>
          </el-table-column>
          <el-table-column prop="pageIndex" label="页码" align="center" width="80"></el-table-column>
          <el-table-column label="操作" align="center" fixed="right" width="200">
            <template slot-scope="scope">
              <el-popconfirm title="确定删除该条数据吗？" @confirm="dataDel(scope.row, scope.$index)">
                <el-button slot="reference" size="mini" type="text" style="margin-right: 10px;">删除</el-button>
              </el-popconfirm>
              <!-- <el-button size="mini" type="text" @click="dataAdd(scope.row)">添加</el-button> -->
              <el-button size="mini" type="text" @click="dataAddPage(scope.row, scope.$index)">添加一页</el-button>
              <el-button size="mini" type="text" @click="moveupOrmovedown(scope.row, scope.$index, 'up')"
                :disabled="!(scope.$index != 0)">上移</el-button>
              <el-button size="mini" type="text" @click="moveupOrmovedown(scope.row, scope.$index, 'down')"
                :disabled="scope.$index == (form.excelTypeList.length - 1)">下移</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div class="table-add">
          <el-button size="mini" type="text" @click="dataAdd()">加一项</el-button>
        </div>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="small" :loading="buttonLoading" type="primary" @click="submitForm">确 定</el-button>
        <el-button size="small" @click="cancel">取 消</el-button>
      </div>
    </jy-dialog>
  </div>
</template>

<script>
import { listBsDataReport, getBsDataReport, delBsDataReport, addBsDataReport, updateBsDataReport, goToTb } from "@/api/syrw/bsDataReport";
import { mapGetters } from "vuex";
import { syTpyeTree } from "@/api/base/syType";
import { listBiExcelType } from "@/api/syrw/biExcelType";
import { getRuleRes } from "@/api/sycs/bsRule";
import { groupBy, orderBy, map } from "lodash";
export default {
  name: "BsDataReport",
  dicts: ["yp_status"],
  data () {
    return {
      defaultProps: {
        children: "children",
        label: "label"
      },
      // 试验类型列表
      syTypeList: [],
      // 按钮loading
      buttonLoading: false,
      // 遮罩层
      loading: false,
      // 选中数组
      ids: [],
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // 数据报告表格数据
      bsDataReportList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        syType: undefined,
        deptId: undefined,
        reportName: undefined,
        reportDate: undefined,
        bgCode: undefined,
        ypCode: undefined,
        jlCode: undefined,
        contractId: undefined,
        excelNums: undefined
      },
      // 表单参数
      form: {
        excelTypeList: [
          {
            excelTypeId: undefined,
            excelTypeName: undefined,
            sl: 1231
          }
        ],
        ypVo: {
          ypClass: undefined,
          ypDescribe: undefined,
          gcbw: undefined,
          fbfxmc: undefined,
          ypStatus: undefined,
          ypDate: undefined,
          ypPerson: undefined
        }
      },
      // 表单校验
      rules: {
        reportId: [{ required: true, message: "唯一标识一份试验任务不能为空", trigger: "blur" }],
        syType: [{ required: true, message: "所属试验类型不能为空", trigger: "change" }],
        deptId: [{ required: true, message: "所属试验室id不能为空", trigger: "change" }],
        reportName: [{ required: true, message: "试验名称不能为空", trigger: "blur" }],
        reportDate: [{ required: true, message: "试验日期不能为空", trigger: "blur" }],
        bgCode: [{ required: true, message: "报告编号不能为空", trigger: "blur" }],
        ypCode: [{ required: true, message: "样品编号不能为空", trigger: "blur" }],
        jlCode: [{ required: true, message: "记录编号不能为空", trigger: "blur" }],
        contractId: [{ required: true, message: "所属合同id不能为空", trigger: "change" }],
        excelNums: [{ required: true, message: "包含excel份数不能为空", trigger: "blur" }],
        excelTypeId: [{ required: true, message: "Excel类型不能为空", trigger: "blur" }]
      },
      biExcelTypeList: [], // excel类型 列表
      //合并表格
      columnArr: ["excelPageNum", "excelTypeId"],
      spanData: [],
      disabledSelectArr: [] // 禁选数组
    };
  },
  // 监听顶部全局下拉
  computed: {
    ...mapGetters(["deptId", "deptName"])
  },
  watch: {
    deptId (newValue, oldValue) {
      this.queryParams.deptId = newValue;
      this.getList();
    },
    deptName (newValue, oldValue) {
      console.log("new -name --" + newValue);
    }
  },
  created () {
    this.queryParams.deptId = this.$store.state.dept.deptId;
    this.form.deptId = this.queryParams.deptId;
    // this.getList();
    this.getSyTypeTreeList();
  },
  methods: {
    handleChange () {
      // this.getExcelTypeList();
      this.form.excelTypeList = [
        {
          excelTypeId: undefined,
          excelTypeName: undefined
        }
      ];
    },
    /** 查询Excel类型管理列表 */
    getExcelTypeList () {
      if (!this.form.syType) {
        return;
      }
      let param = {
        syTypeId: this.form.syType
      };
      listBiExcelType(param).then((response) => {
        this.biExcelTypeList = response.rows;
      });
    },
    handleNodeClick (data) {
      this.form.syType = undefined;

      this.queryParams.syType = data.id;
      if (data.level == 2) {
        this.form.syType = data.id;
      }

      this.getExcelTypeList();
      this.getList();
    },
    /** 查询试验类型树 */
    getSyTypeTreeList () {
      let param = {
        level: 2,
        innerFlag: "1"
      };
      syTpyeTree(param).then((response) => {
        this.syTypeList = response.data;
      });
    },
    /** 查询数据报告列表 */
    getList () {
      if (!this.queryParams.deptId) {
        this.$message.error("请先选择一个试验室");
        return;
      }

      if (!this.queryParams.syType) {
        this.$message.warning("请选择一个合法的试验类型");
        return;
      }
      this.loading = true;
      listBsDataReport(this.queryParams).then((response) => {
        this.bsDataReportList = response.rows;
        this.total = response.total;
        this.loading = false;
      });
    },
    // 取消按钮
    cancel () {
      this.open = false;
      this.reset();
    },
    // 表单重置
    reset () {
      this.form = {
        reportId: undefined,
        syType: undefined,
        deptId: undefined,
        reportName: undefined,
        reportDate: undefined,
        bgCode: undefined,
        ypCode: undefined,
        jlCode: undefined,
        contractId: undefined,
        excelNums: undefined,
        ypVo: {},
        // excelTypeList: undefined,
        delFlag: undefined,
        createBy: undefined,
        createTime: undefined,
        updateBy: undefined,
        updateTime: undefined
      };
      this.form.deptId = this.queryParams.deptId;
      this.disabledSelectArr = []; // 禁选数组清空
      this.resetForm("form");
    },
    /** 搜索按钮操作 */
    handleQuery () {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery () {
      this.resetForm("queryForm");
      this.handleQuery();
    },
    // 多选框选中数据
    handleSelectionChange (selection) {
      this.ids = selection.map((item) => item.reportId);
      this.single = selection.length !== 1;
      this.multiple = !selection.length;
    },
    /** 新增按钮操作 */
    handleAdd () {
      if (!this.queryParams.syType) {
        this.$message.warning("请先选择一个合法的试验类型");
        return;
      }
      this.reset();
      // 获取编号规则
      let param = {
        deptId: this.queryParams.deptId
      };
      getRuleRes(param).then((response) => {
        this.form.ypCode = response.data.ypCode;
        this.form.bgCode = response.data.bgCode;
        this.form.jlCode = response.data.jlCode;
      });
      this.form.syType = this.queryParams.syType;
      this.form.excelNums = 0;
      this.form.excelTypeList = [];
      this.open = true;
      this.title = "添加数据报告";
    },
    /** 修改按钮操作 */
    handleUpdate (row) {
      this.loading = true;
      this.reset();
      const reportId = row.reportId || this.ids;
      getBsDataReport(reportId).then((response) => {
        this.loading = false;
        this.form = response.data;
        if (!this.form.excelTypeList || this.form.excelTypeList.length == 0) {
          // this.form.excelTypeList.push({
          //   excelTypeId: undefined,
          //   excelTypeName: undefined
          // });
        } else {
          let dataList = this.form.excelTypeList;
          this.form.excelTypeList = this.orderArr(dataList);
        }
        this.open = true;
        this.title = "修改数据报告";
      });
    },
    handleTb (row) {
      // goToTb(row);
      let name = "";
      switch (row.syType) {
        case 2:
          name = "tgtb";
          break;
        case 4:
          name = "cjl";
          break;
        case 5:
          name = "xjl";
          break;
        case 6:
          name = "kf";
          break;
        case 8:
          name = "ysbg";
          break;
        case 65:
          name = "ystb";
          break;
        case 15:
          name = "sjnjsj";
          break;
        case 16:
          name = "sjkyqd";
          break;
      }
      if (name === "") {
        this.$message.error("没有对应跳转得页面");
        return;
      }

      console.log("row --" + this.deptName);
      this.$message.success("跳转到报表页面，根据row.excelTypeList来动态展示某些Excel");
      const syTypeValue = this.queryParams.syType;

      // 在当前页面中
      const sendO = { deptName: this.deptName, deptId: this.deptId };

      const serializedData = encodeURIComponent(JSON.stringify(sendO));

      if (syTypeValue === 65) {
        // 沥青报告
        const newPageUrl = "http://localhost/reportLq/soilTable?data=" + serializedData;
        window.open(newPageUrl, "_blank");
      }
      const { href } = this.$router.resolve({
        name: name,
        query: {
          t: new Date().getTime(),
          reportId: row.reportId
        }
      });
      window.open(href, "_blank");
    },
    handleCopy (row) {
      // this.$message.success("调用后台接口实现")
      this.$message({
        showClose: true,
        message: "正在开发中..."
      });
    },
    /** 提交按钮 */
    submitForm () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          this.buttonLoading = true;
          if (this.form.reportId != null) {
            // 更新时，去除没有excelTypeId的无效行
            let form = this.form;
            form.excelTypeList = this.form.excelTypeList.filter((item) => item.excelTypeId);
            updateBsDataReport(form)
              .then((response) => {
                this.$modal.msgSuccess("修改成功");
                this.open = false;
                this.getList();
              })
              .finally(() => {
                this.buttonLoading = false;
              });
          } else {
            addBsDataReport(this.form)
              .then((response) => {
                this.$modal.msgSuccess("新增成功");
                this.open = false;
                this.getList();
              })
              .finally(() => {
                this.buttonLoading = false;
              });
          }
        }
      });
    },
    /** 删除按钮操作 */
    handleDelete (row) {
      const reportIds = row.reportId || this.ids;
      this.$modal
        .confirm('是否确认删除数据报告编号为"' + reportIds + '"的数据项？')
        .then(() => {
          this.loading = true;
          return delBsDataReport(reportIds);
        })
        .then(() => {
          this.loading = false;
          this.getList();
          this.$modal.msgSuccess("删除成功");
        })
        .catch(() => { })
        .finally(() => {
          this.loading = false;
        });
    },
    /** 导出按钮操作 */
    handleExport () {
      this.download(
        "syrw/bsDataReport/export",
        {
          ...this.queryParams
        },
        `bsDataReport_${new Date().getTime()}.xlsx`
      );
    },
    // 删除一行
    dataDel (row, index) {
      if (!!this.form.excelTypeList && this.form.excelTypeList.length > 1) {
        this.form.excelTypeList.splice(index, 1);
        this.form.excelTypeList = this.orderArr(this.form.excelTypeList);
        this.form.excelNums = this.form.excelTypeList[this.form.excelTypeList.length - 1].excelPageNum;
      } else {
        // this.$message({
        //   message: '无法删除当前行',
        //   type: 'error',
        //   offset: 150
        // });
        this.form.excelTypeList.splice(index, 1);
        this.form.excelNums = 0;
      }
    },
    // 添加一行
    dataAdd () {
      this.$refs["form"].validate((valid) => {
        if (valid) {
          let obj = {
            excelId: undefined,
            excelIndex: undefined,
            excelTypeId: undefined,
            excelTypeName: undefined,
            label: undefined,
            reportId: undefined
          };
          this.form.excelTypeList.push(obj);
          this.form.excelTypeList = this.orderArr(this.form.excelTypeList);
          this.form.excelNums = this.form.excelTypeList[this.form.excelTypeList.length - 1].excelPageNum;
        }
      });
    },
    // 添加一页
    dataAddPage (row, index) {
      let info = JSON.parse(JSON.stringify(row));
      info.excelId = undefined;
      this.form.excelTypeList.splice(index + 1, 0, info);
      this.form.excelTypeList = this.orderArr(this.form.excelTypeList);
    },
    moveupOrmovedown (row, index, type) {
      let arr = this.form.excelTypeList;
      let findIndex = this.form.excelTypeList.findIndex((item) => item.date === row.date);
      type === "up" ? arr.splice(index - 1, 1, ...arr.splice(index, 1, arr[index - 1])) : arr.splice(index, 1, ...arr.splice(index + 1, 1, arr[index]));
      this.form.excelTypeList = this.orderArr(arr);
    },
    excelTypeChange (row) {
      if (this.form.excelTypeList) {
        this.biExcelTypeList.forEach((v) => {
          if (v.excelTypeId == row.excelTypeId) {
            row.label = v.label;
            // 因为excelType变了,所以excelId无效了,这点传参很重要,后台通过excelId来判断是否为新增
            // row.excelId = undefined;
          }
        });
      }
    },
    // 数组排序
    orderArr (list) {
      let result = [];
      const xhGroupData = orderBy(
        map(groupBy(list, "indexNum"), (item, key) => {
          return {
            indexNum: key,
            index: item[0].index,
            value: item
          };
        }),
        "index"
      );

      for (const data of xhGroupData) {
        const gcxmGroupData = groupBy(data.value, "excelTypeId");
        for (const gcxm in gcxmGroupData) {
          let index = Object.keys(gcxmGroupData).indexOf(gcxm);
          const item = gcxmGroupData[gcxm];
          item.forEach((element, eIndex) => {
            element["excelPageNum"] = index + 1;
            element["pageIndex"] = eIndex + 1;
          });
          result = [...result, ...item];
        }
      }
      const uniqueExcelIds = new Set(); // 禁选数组
      // 使用map遍历result数组，只将存在的excelId添加到Set中
      result.forEach((item) => {
        if (item.excelId !== undefined) {
          uniqueExcelIds.add(item.excelTypeId);
        }
      });
      // 将Set转换回数组
      this.disabledSelectArr = [...uniqueExcelIds];
      this.getSpanData(result);
      return result;
    },
    // 计算需要合并的单元格
    getSpanData (data) {
      if (!data || data.length === 0 || !this.columnArr || this.columnArr.length === 0) {
        return;
      }
      this.spanData = [];
      for (let i = 0; i < this.columnArr.length; i++) {
        let contactDot = 0;
        const spanArr = [];
        data.forEach((item, index) => {
          // console.log(item)
          if (index === 0) {
            spanArr.push(1);
          } else {
            const isMergeRow = this.isMerge(data[index - 1], item, i);
            if (isMergeRow) {
              spanArr[contactDot] += 1;
              spanArr.push(0);
            } else {
              contactDot = index;
              spanArr.push(1);
            }
          }
        });
        this.spanData.push(spanArr);
      }

      // console.log(this.spanData)
    },
    // 是否合并
    isMerge (prevItem, item, index) {
      let ret = true;
      for (let i = 0; i <= index; i++) {
        const element = this.columnArr[i];
        if (item[element] !== prevItem[element]) {
          ret = false;
          break;
        }
      }
      return ret;
    },
    // 合并单元格
    objectSpanMethod ({ row, column, rowIndex, columnIndex }) {
      if (this.columnArr.includes(column.property)) {
        const index = this.columnArr.findIndex((item) => {
          return item == column.property;
        });
        if (this.spanData[index]) {
          if (this.spanData[index][rowIndex]) {
            return {
              rowspan: this.spanData[index][rowIndex],
              colspan: 1
            };
          } else {
            return {
              rowspan: 0,
              colspan: 0
            };
          }
        }
      }
    }
  }
};
</script>

<style lang="scss" scoped>
@import "~@/assets/styles/demo.scss";

.table-add {
  text-align: center;
  line-height: 23px;
  padding: 4px;
  border: 1px solid #dfe6ec;
  border-top: 0px solid #dfe6ec;
}
</style>
